#app,
page {
  background-color: #f5f5f5;
}
/* 颜色变量 */
$theme-head-color: #3c9cff;
/*  -- flex弹性布局 -- */

.flex {
  display: flex;
}

.basis-xs {
  flex-basis: 20%;
}

.basis-sm {
  flex-basis: 40%;
}

.basis-df {
  flex-basis: 50%;
}

.basis-lg {
  flex-basis: 60%;
}

.basis-xl {
  flex-basis: 80%;
}

.flex-sub {
  flex: 1;
}

.flex-twice {
  flex: 2;
}

.flex-treble {
  flex: 3;
}

.flex-direction {
  flex-direction: column;
}

.flex-wrap {
  flex-wrap: wrap;
}

.align-start {
  align-items: flex-start;
}

.align-end {
  align-items: flex-end;
}

.align-center {
  align-items: center;
}

.align-stretch {
  align-items: stretch;
}

.self-start {
  align-self: flex-start;
}

.self-center {
  align-self: flex-center;
}

.self-end {
  align-self: flex-end;
}

.self-stretch {
  align-self: stretch;
}

.align-stretch {
  align-items: stretch;
}

.justify-start {
  justify-content: flex-start;
}

.justify-end {
  justify-content: flex-end;
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.justify-around {
  justify-content: space-around;
}
.main-pd {
  padding: 0 32rpx;
}
.list-item {
  border-bottom: 1rpx solid #e6e6e6;
  padding-bottom: 28rpx;
  padding-top: 28rpx;
  font-size: 32rpx;
  &:first-child {
    padding-top: 0;
  }
  &:last-child {
    border: none;
    padding-bottom: 0;
  }
}
.normal-cell {
  ::v-deep {
    .u-cell__body {
      padding: 28rpx 0 !important;
    }
    .u-cell__title-text {
      color: #595959 !important;
      font-size: 32rpx !important;
    }
    .u-cell__label,
    .u-cell__value {
      color: #333 !important;
      font-size: 32rpx !important;
    }
  }
}
.text-c {
  text-align: center;
}
.u-card {
  padding: 32rpx;
  box-sizing: border-box;
  border-radius: 12rpx;
  background-color: #fff;
}
// 定义字体(px)单位，小于20都为px单位字体
@for $i from 9 to 20 {
  .font-#{$i} {
    font-size: $i + px;
  }
}

// 定义字体(rpx)单位，大于或等于20的都为rpx单位字体
@for $i from 20 through 60 {
  .font-#{$i} {
    font-size: $i + rpx;
  }
}

@for $i from 20 through 60 {
  .line-h-#{$i} {
    line-height: $i + rpx;
  }
}

@for $i from 0 through 750 {
  .w-#{$i} {
    width: $i + rpx !important;
  }
}
// 颜色

$colors: (
  "f34b47": #f34b47,
  "bfbfbf": #bfbfbf,
  "333": #333,
  "999": #999,
  "fff": #fff,
  "000": #000,
  "8c8c8c": #8c8c8c,
  "595959": #595959,
);
@each $colorKey, $color in $colors {
  .color-#{$colorKey} {
    color: $color;
  }
}
.empty-con {
  height: 70vh;
  display: flex;
  align-items: center;
  justify-content: center;
}
